<template>
  <!-- 修改用户信息 -->
  <div>
    <van-row class="header4" gutter="20">
      <van-col span="2">
        <van-icon name="arrow-left" @click="chan" />
      </van-col>
      <van-col span="18">
        <span class="person">编辑</span>
      </van-col>
      <van-col span="4">
        <van-icon name="wap-home-o" @click="$router.push('/home')" />
      </van-col>
    </van-row>
    <div class="name-phone">
      <van-cell-group>
        <van-field
          label="客户姓名"
          v-model="value1"
          input-align="right"
          required
        />
      </van-cell-group>

      <van-cell-group>
        <van-field
          label="联系方式"
          v-model="value2"
          input-align="right"
          required
        />
      </van-cell-group>
    </div>
    <div class="xiangqing">
      <van-cell-group>
        <van-field v-model="value3" label="学历" input-align="right" />
      </van-cell-group>
      <van-cell-group>
        <van-field v-model="value4" label="年龄" input-align="right" />
      </van-cell-group>
      <van-cell-group>
        <van-field v-model="value5" label="性别" input-align="right" />
      </van-cell-group>
      <van-cell-group>
        <van-field v-model="value6" label="所属城市" input-align="right" />
      </van-cell-group>
      <van-cell-group>
        <van-field v-model="value7" label="公司名称" input-align="right" />
      </van-cell-group>
      <van-cell-group>
        <van-field v-model="value8" label="职务" input-align="right" />
      </van-cell-group>
    </div>
    <div class="lose">
      <van-button color="#003399" round @click="SureClick">确认修改</van-button>
    </div>
  </div>
</template>

<script>
import { PutUserMess } from "@/request/api";
export default {
  data() {
    return {
      value1: this.data.custName,
      value2: this.data.telephone,
      value3: this.data.education,
      value4: this.data.age,
      value5: this.data.sex,
      value6: this.data.cityName,
      value7: this.data.company,
      value8: this.data.position
    };
  },
  methods: {
    SureClick() {
        PutUserMess({
            custName : this.value1,
            telephone : this.value2,
            education : this.value3,
            age : this.value4,
            sex : this.value5,
            cityName : this.value6,
            company : this.value7,
            position : this.value8,
            id : this.$route.query.id
        }).then(res=>{
            console.log(res);
        })
    },
    chan() {
      this.$emit("chan");
    }
  },
  props: ["data"],

};
</script>
 
<style lang = "less" scoped>
.header4 {
  background-color: #003399;
  color: #fff;
  padding: 0.066667rem 0.066667rem;
  text-align: center;
  display: flex;
  .van-col {
    .person {
      display: block;
      margin-top: 0.026667rem;
    }
  }

  .van-icon {
    vertical-align: -0.053333rem;
    font-size: 0.3rem;
    vertical-align: -0.056667rem;
  }
}
.name-phone {
  margin-top: 0.133333rem;
  background-color: #fff;

  .van-col {
    line-height: 0.4rem;
    padding: 0.1rem;
    border-bottom: 1px solid #eee;
  }
}
.span14 {
  text-align: right;
  color: #aaa;
  height: 0.60967rem;
}
.xiangqing {
  margin-top: 0.133333rem;
  background-color: #fff;
  .van-col {
    line-height: 0.4rem;
    padding: 0.1rem;
    border-bottom: 1px solid #eee;
  }
}
.lose {
  width: 100%;
  background-color: #fff;
  position: fixed;
  left: 0;
  bottom: 0;
  height: 0.533333rem;
  .van-button {
    width: 90%;
    border: none;
    font-size: 0.16rem;
    margin-left: 0.193333rem;
    margin-top: 0.046667rem;
  }
}
</style>